<ion-view id="home-view" view-title="">
  <ion-nav-buttons side="left" style="width:100%">
    <button class="button button-clear" ng-click="selectLoc()">
      {{dist.name}}
      <i class="icon ion-ios-location-outline"></i>
    </button>
    <label ng-click="goSearch(-1, 1)" style="background-color: #b50b17; width: 60%; border-radius: 10px; left: 40%; height: 35px; line-height: 33px; top: 5px; position: fixed; z-index: 1000; color: #fff">
      <i class="icon ion-search placeholder-icon" style="display: inline; padding-left: 10px; color: #fff"></i>
      <input id="search-input" onfocus="this.blur()" style="display: inline; padding-left: 10px; width: 80%; background-color: #b50b17; color: #fff" type="text" value="搜索商品，闪电配送">
    </label>
  </ion-nav-buttons>
  <!-- <ion-nav-buttons side="right">
    <button class="button button-clear icon ion-ios-search" ui-sref-opts="{reload: true, notify: true}" ui-sref="goods.search({classid:-1, type:1})"></button>
  </ion-nav-buttons> -->
  <ion-content>
    <ion-refresher on-refresh="refresh()" pulling-text="下拉刷新..."></ion-refresher>
    <div>
      <!-- 广告轮播头 -->
      <ion-slide-box on-slide-changed="headerImgChange(index)" style="width: 100%">
        <!-- <ion-slide>
        <div><img alt="" src="img/hd/banner1.png" width="100%"/></div>
      </ion-slide>
      <ion-slide>
        <div><img alt="" src="img/hd/banner1.png" width="100%"/></div>
      </ion-slide>
      <ion-slide>
        <div><img alt="" src="img/hd/banner1.png" width="100%"/></div>
      </ion-slide> -->
        <ion-slide ng-repeat="pic in homepics | orderBy: 'position'" style="width: 100%">
          <div ng-click="picClick(pic)" style="width: 100%"><img alt="" ng-src="{{pic.imgurl}}" style="width: 100%"/></div>
        </ion-slide>
      </ion-slide-box>

      <div class="subclass" item-height="getSubClassHeight()" >
        <div class="row">
          <div class="col" ng-click="goSearch(classes[0].product_class_id, 1)">
            <div><img alt="" ng-src="{{classes[0].imgurl}}" style="width: 100%"></div>
            <div class="subclass-title">{{classes[0].name}}</div>
          </div>
          <div class="col" ng-click="goSearch(classes[1].product_class_id, 1)">
            <div><img alt="" ng-src="{{classes[1].imgurl}}" style="width: 100%"></div>
            <div class="subclass-title">{{classes[1].name}}</div>
          </div>
          <div class="col" ng-click="goSearch(classes[2].product_class_id, 1)">
            <div><img alt="" ng-src="{{classes[2].imgurl}}" style="width: 100%"></div>
            <div class="subclass-title">{{classes[2].name}}</div>
          </div>
          <div class="col" ng-click="goSearch(classes[3].product_class_id, 1)">
            <div><img alt="" ng-src="{{classes[3].imgurl}}" style="width: 100%"></div>
            <div class="subclass-title">{{classes[3].name}}</div>
          </div>
        </div>
        <div class="row">
          <div class="col" ng-click="goSearch(classes[4].product_class_id, 1)">
            <div><img alt="" ng-src="{{classes[4].imgurl}}" style="width: 100%"></div>
            <div class="subclass-title">{{classes[4].name}}</div>
          </div>
          <div class="col" ng-click="goSearch(classes[5].product_class_id, 1)">
            <div><img alt="" ng-src="{{classes[5].imgurl}}" style="width: 100%"></div>
            <div class="subclass-title">{{classes[5].name}}</div>
          </div>
          <div class="col" ng-click="goSearch(classes[6].product_class_id, 1)">
            <div><img alt="" ng-src="{{classes[6].imgurl}}" style="width: 100%"></div>
            <div class="subclass-title">{{classes[6].name}}</div>
          </div>
          <div class="col" ng-click="goSearch(0, 1)">
            <div><img alt="" src="img/hd/icon_qb.png" style="width: 100%"></div>
            <div class="subclass-title">全部</div>
          </div>
        </div>
      </div>

      <div class="divider"></div>

      <div class="piece cursale" ng-show="homesales && homesales.length > 0">
        <div class="cursale-title">
          <div style="float: left" ui-sref-opts="{reload: true, notify: true}" ui-sref="goods.cursale">今日折扣</div>
          <i class="icon ion-chevron-right" style="float: right; color: #eee"></i>
          <div style="clear: both"></div>
        </div>

        <div class="thin-line"></div>

        <div class="row cursale-goods" item-height="getSaleHeight()">
          <div class="col col-33 cursale-goods-item" ng-click="goSaleDetail(good.product_id)" ng-repeat="good in homesales | orderBy: 'index'">
            <div class="">
              <img alt="" ng-src="{{good.smimgurl}}" style="width: 100%">
            </div>
            <div class="cursale-goods-item-price">
              <b style="font-size: 17px">{{good.cx_price}}</b>
              <b style="font-size: 15px">元</b>
              <del style="font-size: 13px; color: #aaa">{{good.sc_price}}元</del>
            </div>
          </div>
        </div>
      </div>

      <div class="divider"></div>

      <div class="piece triclass">
        <div class="row" item-height="getClass1Height()">
          <div class="col" ng-click="goClass(homeads[0].product_class.product_class_id, homeads[0].product_class.type)" style="background-image: url('{{homeads[0].imgurl}}'); background-size: contain; background-repeat: no-repeat; background-position: 50%; width:100%; height: 150px">
            <div class="triclass-item-main-title" style="color:#eb3379">
              {{homeads[0].product_class.name}}
            </div>
            <div class="triclass-item-sub-title">
              {{homeads[0].product_class.descript}}
            </div>
          </div>
          <div class="col">
            <div class="triclass-md" ng-click="goClass(homeads[1].product_class.product_class_id, homeads[1].product_class.type)" style="background-image: url('{{homeads[1].imgurl}}'); background-size: contain; background-repeat: no-repeat; background-position: bottom right; width:100%; height: 80px">
              <div class="triclass-item-main-title" style="color:#00d292">
                {{homeads[1].product_class.name}}
              </div>
              <div class="triclass-item-sub-title">
                {{homeads[1].product_class.descript}}
              </div>
            </div>
            <div class="triclass-md" ng-click="goClass(homeads[2].product_class.product_class_id, homeads[2].product_class.type)" style="background-image: url('{{homeads[2].imgurl}}'); background-size: contain; background-repeat: no-repeat; background-position: bottom right; width:100%; height: 80px">
              <div class="triclass-item-main-title" style="color:#d76458">
                {{homeads[2].product_class.name}}
              </div>
              <div class="triclass-item-sub-title">
                {{homeads[2].product_class.descript}}
              </div>
            </div>
          </div>
        </div>

        <div class="triclass-sm">
          <div class="thin-line"></div>

          <div class="row">
            <div class="col col-33" ng-click="goClass(homeads[3].product_class.product_class_id, homeads[3].product_class.type)" ui-sref-opts="{reload: true, notify: true}">
              <div class="triclass-item-main-title" style="color:#d76458">
                {{homeads[3].product_class.name}}
              </div>
              <div class="triclass-item-sub-title">
                {{homeads[3].product_class.descript}}
              </div>
              <div>
                <!-- <img alt="" ng-show="!homeads[3].imgurl" ng-src="img/hd/file.png" style="width: 100%"/> -->
                <img alt="" ng-src="{{homeads[3].imgurl}}" style="width: 100%">
              </div>
            </div>
            <div class="col col-33" ng-click="goClass(homeads[4].product_class.product_class_id, homeads[4].product_class.type)">
              <div class="triclass-item-main-title" style="color:#fb7332">
                {{homeads[4].product_class.name}}
              </div>
              <div class="triclass-item-sub-title">
                {{homeads[4].product_class.descript}}
              </div>
              <div>
                <!-- <img alt="" ng-show="!homeads[4].imgurl" ng-src="img/hd/file.png" style="width: 100%"/> -->
                <img alt="" ng-src="{{homeads[4].imgurl}}" style="width: 100%">
              </div>
            </div>
            <div class="col col-33" ng-click="goClass(homeads[5].product_class.product_class_id, homeads[5].product_class.type)">
              <div class="triclass-item-main-title" style="color:#00bdf0">
                {{homeads[5].product_class.name}}
              </div>
              <div class="triclass-item-sub-title">
                {{homeads[5].product_class.descript}}
              </div>
              <div>
                <!-- <img alt="" ng-show="!homeads[5].imgurl" ng-src="img/hd/file.png" style="width: 100%"/> -->
                <img alt="" ng-src="{{homeads[5].imgurl}}" style="width: 100%">
              </div>
            </div>
          </div>
        </div>
      </div>

      <div class="divider"></div>

      <div class="piece theme">
        <div class="theme-title">
          <span>主题商城</span>
        </div>

        <div class="thin-line"></div>

        <div class="theme-type">
          <div class="row">
            <div class="col col-50" ng-click="goClass(homeads[6].product_class.product_class_id, homeads[6].product_class.type)">
              <div class="row">
                <div class="col col-60">
                  <div class="theme-item-main-title">{{homeads[6].product_class.name}}</div>
                  <div class="theme-item-sub-title">{{homeads[6].product_class.descript}}</div>
                </div>
                <div class="col col-30">
                  <img alt="" ng-src="{{homeads[6].imgurl}}" style="width: 100%">
                </div>
              </div>
            </div>
            <div class="col col-50" ng-click="goClass(homeads[7].product_class.product_class_id, homeads[7].product_class.type)">
              <div class="row">
                <div class="col col-60">
                  <div class="theme-item-main-title">{{homeads[7].product_class.name}}</div>
                  <div class="theme-item-sub-title">{{homeads[7].product_class.descript}}</div>
                </div>
                <div class="col col-30">
                  <img alt="" ng-src="{{homeads[7].imgurl}}" style="width: 100%">
                </div>
              </div>
            </div>
          </div>

          <div class="thin-line"></div>

          <div class="row">
            <div class="col col-50" ng-click="goClass(homeads[8].product_class.product_class_id, homeads[8].product_class.type)">
              <div class="row">
                <div class="col col-60">
                  <div class="theme-item-main-title">{{homeads[8].product_class.name}}</div>
                  <div class="theme-item-sub-title">{{homeads[8].product_class.descript}}</div>
                </div>
                <div class="col col-30">
                  <img alt="" ng-src="{{homeads[8].imgurl}}" style="width: 100%">
                </div>
              </div>
            </div>
            <div class="col col-50" ng-click="goClass(homeads[9].product_class.product_class_id, homeads[9].product_class.type)">
              <div class="row">
                <div class="col col-60">
                  <div class="theme-item-main-title">{{homeads[9].product_class.name}}</div>
                  <div class="theme-item-sub-title">{{homeads[9].product_class.descript}}</div>
                </div>
                <div class="col col-30">
                  <img alt="" ng-src="{{homeads[9].imgurl}}" style="width: 100%">
                </div>
              </div>
            </div>
          </div>

          <div class="thin-line"></div>

          <div class="row">
            <div class="col col-50" ng-click="goClass(homeads[10].product_class.product_class_id, homeads[10].product_class.type)">
              <div class="row">
                <div class="col col-60">
                  <div class="theme-item-main-title">{{homeads[10].product_class.name}}</div>
                  <div class="theme-item-sub-title">{{homeads[10].product_class.descript}}</div>
                </div>
                <div class="col col-30">
                  <img alt="" ng-src="{{homeads[10].imgurl}}" style="width: 100%">
                </div>
              </div>
            </div>
            <div class="col col-50" ng-click="goClass(homeads[11].product_class.product_class_id, homeads[11].product_class.type)">
              <div class="row">
                <div class="col col-60">
                  <div class="theme-item-main-title">{{homeads[11].product_class.name}}</div>
                  <div class="theme-item-sub-title">{{homeads[11].product_class.descript}}</div>
                </div>
                <div class="col col-30">
                  <img alt="" ng-src="{{homeads[11].imgurl}}" style="width: 100%">
                </div>
              </div>
            </div>
          </div>

          <div class="thin-line"></div>

          <div class="row">
            <div class="col col-50" ng-click="goClass(homeads[12].product_class.product_class_id, homeads[12].product_class.type)">
              <div class="row">
                <div class="col col-60">
                  <div class="theme-item-main-title">{{homeads[12].product_class.name}}</div>
                  <div class="theme-item-sub-title">{{homeads[12].product_class.descript}}</div>
                </div>
                <div class="col col-30">
                  <img alt="" ng-src="{{homeads[12].imgurl}}" style="width: 100%">
                </div>
              </div>
            </div>
            <div class="col col-50" id="home-last" ng-click="goClass(homeads[13].product_class.product_class_id, homeads[13].product_class.type)">
              <div class="row">
                <div class="col col-60">
                  <div class="theme-item-main-title">{{homeads[13].product_class.name}}</div>
                  <div class="theme-item-sub-title">{{homeads[13].product_class.descript}}</div>
                </div>
                <div class="col col-30">
                  <img alt="" ng-src="{{homeads[13].imgurl}}" style="width: 100%">
                </div>
              </div>
            </div>
          </div>
        </div>
      </div>
    </div>
  </ion-content>
</ion-view>
